<template>
  <!-- ref 定义方法 -->
  <div ref="myRef" id="myBox">{{ count }}</div>
  <HelloWorld ref="myComRef"/>
</template>

<script setup>
import { onMounted, ref } from 'vue'
import HelloWorld from './components/HelloWorld.vue'

const count = ref(0)

// ref 获取原生dom
// vue2 获取方法 this.$refs.myRef
const myRef = ref(null)

console.log('setup', myRef.value);

onMounted(() => {
  console.log('onMounted', myRef.value);
  setTimeout(() => {
    myRef.value.innerText = '你好世界'
  }, 1000);
})


// ref 获取组件
// 以及组件内数据或者函数的使用
const myComRef = ref(null)
onMounted(()=>{
  console.log('onMounted myComRef', myComRef.value.msg);
})
</script>